
.el-button{
    padding: 8px 20px;
}
.el-button--primary{
    background-color: #30BBF7;
    border-color:#30BBF7;
    &:hover{
        background-color: #30BBF7;
        border-color:#30BBF7;
    }
}
.el-button--info{
    background-color: #f2f2f2;
    border-color:#f2f2f2;
    color: #4a4a4a;
    &:hover{
        background-color: #f2f2f2;
        border-color:#f2f2f2;
        color: #4a4a4a;
    }
}
.el-button--small{
    // padding: 3px 15px;
}
.el-button--mini{
    padding: 3px 15px;
}
.mt20{
    margin-top: 20px;
}
.mb0{
    margin-bottom: 0 !important;
}
.mr15{
    margin-right: 15px;
}
.btn-210{
    width: 210px;
}
.btn-300{
    width: 300px;
}
.small_wrap{
    width: 210px;
    margin: 0 auto;
}
.md_wrap{
    width: 300px;
    margin: 0 auto;
}
.md_wrap2{
    width: 500px;
    margin: 0 auto;
}
.lg_wrap{
    width: 630px;
    margin: 0 auto;
}
.dark_content{
    color: #000;
}
.fz14{
    font-size: 14px;
}
.input1{
    width: 186px;
}
.w_85{
    width: 85px;
}
.w80{
    width: 80%;
}
.wrap{
    min-height: 100%;
    background-image: linear-gradient(#279DF4,#36CEF9);
    // padding-bottom: 40px;
    position: relative;
    text-align: center;
    .no-b{
        border-bottom: 0 !important;
    }
    .btn_mini{
        height: 20px;
        line-height: 20px;
        padding: 0 15px;
        background-color: #30BBF7;
    }
    .header{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 30px 0;
        max-width: 980px;
        width: 90%;
        margin: 0 auto;
        .header-l{
            display: flex;
            align-items: flex-end;
            .logo{
                width: 33px;
                height: 35px;
            }
            .title{
                font-size: 18px;
                color: #fff;
                line-height: 1;
            }
        }
        .header-r{
            & > div+div{
                margin-left: 20px;
            }
        }
    }
    .content{
        width: 90%;
        max-width: 980px;
        margin: 0 auto;
        .tab_head{
            padding-bottom:35px;
            position: relative;
            .sign{
                position: absolute;
                width: 0;
                height: 0;
                border-width: 17px;
                border-color: #fff transparent transparent #fff;
                border-style: solid;
                border-top-left-radius: 10px;
                bottom: -2px;
                transform: translate(-50%,50%) rotate(45deg);
                transition: left ease-in .2s;
                &.s0{
                    left: 10%;
                }
                &.s1{
                    left: 30%;
                }
                &.s2{
                    left: 50%;
                }
                &.s3{
                    left: 70%;
                }
                &.s4{
                    left: 90%;
                }
            } 
            .tab_item{
                flex:1;
                & > div{
                    width: 64px;
                    height: 64px;
                    background-color: #4DB6FA;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    cursor: pointer;
                    &.active{
                        background-color: #fff;
                    }
                    img{
                        width: 32px;
                    }
                }
                span{
                    color:#fff;
                    font-size: 14px;
                    margin-top: 6px;
                }
            }
        }
        .tab_content{
            background-color: #fff;
            border-radius: 6px;
            padding: 42px;
            .submit_btn{
                background-image: linear-gradient(#279DF4,#36CEF9);
                padding: 6px 36px;
                color: #fff;
                font-size: 14px;
                border-radius: 4px;
                cursor: pointer;
            }
            .tab_input{
                width: 220px;
                input{
                    height: 24px;
                }
            }
            .tab_select{
                width: 220px;
            }
            .tab_v_margin{
                margin-top: 44px;
            }
            .list_t{
                font-size: 14px;
                color:#000;
                text-align: left;
                margin-bottom: 6px;
            }
            .list_line{
                height: 3px;
                background-image: linear-gradient(to right,#279DF4,#36CEF9);
            }
            .list_item{
                border-bottom: 1px solid #d0d0d0;
                padding: 5px 0;
                color: #b1b1b1;
                font-size: 12px;
                &.flex_h{
                    span{
                        &:first-child{
                            min-width: 117px;
                            text-align: left;
                        }
                        &:last-child{
                            text-align: right;
                        }
                    }
                }
            }
            .list_item_uniform{
                border-bottom: 1px solid #d0d0d0;
                min-height: 20px;
                padding: 5px 0;
                color: #b1b1b1;
                font-size: 12px;
                &.no-h{
                    height: auto;
                }
                .t{
                    font-size: 14px;
                    color:#000;
                }
                & > div{
                    text-align: left;
                    flex: 1;
                    &.w100{
                        width: 12%;
                        flex-shrink: 0;
                        flex: unset;
                    }
                    &.w200{
                        width: 25%;
                        flex-shrink: 0;
                        flex: unset;
                    }
                }
                & > p{
                    flex: 1;
                    text-align: left;
                }
            }
        }
        .tab3_head{
            background-color: #F2F2F2;
            height: 42px;
            display: flex;
            border-radius: 4px;
            cursor: pointer;
            .tab3_head_item{
                flex:1;
                text-align: center;
                font-size: 14px;
                color: #4a4a4a;
                line-height: 42px;
                &:first-child{
                    border-top-left-radius:4px;
                    border-bottom-left-radius:4px;
                }
                &:last-child{
                    border-top-right-radius:4px;
                    border-bottom-right-radius:4px;
                }
                &.active{
                    background-color: #2EB2F6;
                    color: #fff;
                }
            }
        }
        .tab3_head_mb{
            background-color: #F2F2F2;
            height: 51px;
            display: flex;
            margin: -20px;
            overflow-x: scroll;
            overflow-y: hidden;
            &::-webkit-scrollbar {display:none}
            .tab3_head_item{
                text-align: center;
                font-size: 12px;
                color: #4a4a4a;
                line-height: 51px;
                // width: 100px;
                padding: 0 16px;
                flex-shrink: 0;
                &.active{
                    color: #29A3F4;
                    border-bottom: 3px solid #29A3F4;
                }
            }
        }
        .tab3_content{
            padding-top: 40px;
        }
    }
    .copyright{
        font-size: 12px;
        color: rgba(255, 255, 255, .57);
        position: absolute;
        bottom: 30px;
        width: 100%;
        text-align: center;
    }
}